import React, {Component} from "react";

class Detail extends Component{
    constructor(props) {
        super(props);
        this.state = {
            detail:{}
        }
    }
    //获取用户id
    componentDidMount() {
		fetch("https://cnodejs.org/api/v1/topic/"+this.props.id)
            .then(res=>res.json())
            .then(res=>
                this.setState({
                    detail:res.data
                })
            )
	}
    render() {
        const {detail} = this.state;
        return <div>
            <h1 style={{color:"#f0f",textAlign:"center"}}>{detail.title}</h1>
            <div style={{width:"200px",margin:"0 auto"}}>
                <img src={detail.author?.avatar_url} alt="头像" style={{width:"100px",height:"100px"}}/>
                <p>作者：{detail.author?.loginname}</p>
            </div>
            <div dangerouslySetInnerHTML={{__html:detail.content}} style={{width:"80%",padding:"20px 20px",margin:"0 auto",lineHeight:"16px",wordWrap:"break-word",backgroundColor:"#eee"}}></div>
        </div>
    }
}

export default Detail;